revision:
<div class="spec grid"> <p class="tijd" id="date-A"></p> <p class="tijd" id="date-B"></p> </div> <style> .tijd{position: relative; width: 20vw; height: 2vw; border: 0.2vw solid darkgrey; padding: 1vw; background-color: skyblue; color: green;} </style> <script> function updateClock() { var currentdate = new Date(); var day = currentdate.getDate(); var month = currentdate.getMonth() + 1; var year = currentdate.getFullYear(); this.date = " " + day + "/" + month + "/" + year; this.h = currentdate.getHours(); this.m = currentdate.getMinutes(); this.s = currentdate.getSeconds(); } updateClock.prototype.run = function () { setInterval(this.update.bind(this), 1000); }; updateClock.prototype.update = function () { this.updateTime(1); var time = " @ " + this.h + ":" + this.m + ":" + this.s; var datetime = this.date + time; document.getElementById('date-A').innerHTML = "now: " + datetime; return datetime; }; updateClock.prototype.updateTime = function (secs) { this.s += secs; if (this.s >= 60) { this.m++; this.s = 0; }; if (this.m >= 60) { this.h++; this.m = 0; }; if (this.h >= 24) { this.day++; this.h = 0; } }; var newclock = new updateClock(); newclock.run(); var timedate = newclock.update(); console.log(timedate) document.getElementById("date-B").innerHTML = "clock updated at : " + (timedate); </script>